{% load dajaxice_templatetags %}
<!DOCTYPE html>
<html x-manifest="{{MEDIA_URL}}/m/application.manifest">
    <head>
        <title>infocarretera</title>
        <meta name="apple-mobile-web-app-capable" content="yes" />
        <meta name="apple-mobile-web-app-status-bar-style" content="black" />
        <link rel="apple-touch-startup-image" href="{{ MEDIA_URL }}/m/img/splash.jpg">
        <meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; minimum-scale=1.0; user-scalable=false;"/>
        <link rel="shortcut icon" href="{{ MEDIA_URL }}/m/apple-touch-icon-precomposed.png" />
        <link rel="stylesheet" href="{{ MEDIA_URL }}/m/css/basic.css" type="text/css">
        <script type="text/javascript" src="http://www.google.com/jsapi?key=ABQIAAAALCdLm8DU2gHDctObOm4ddxTM16sdO-7tYrf-Oaslh395x1EaIBT8TqqzX_ue7cOK4Kzz_mEmSCLZYA&callback=function(){}"></script>
        {% comment %}<script type="text/javascript" src="http://www.google.com/jsapi?key=ABQIAAAALCdLm8DU2gHDctObOm4ddxR1pauXVYIL8pyHr_luMwsYh5dNjxT19kbgt2GI4VaueKTXWYmZHHjuQQ&callback=function(){}"></script>
       <script src="http://www.google.com/jsapi?key=ABQIAAAAFF8vk_pPGNwo5tzRQnkhLhTRrC1QYmnq1wTYuHUUfge-dbW0IxTEsihNW3OeOcAkTOd9l2Ympz-meQ&callback=function(){}"></script>{% endcomment %}
        <script type="text/javascript">
            //google.load("jquery", "1.3.2");
            var MEDIA_URL = "{{ MEDIA_URL }}";
        </script>
    </head>
    <body>
        <div id="header">
            <div id="logo"></div>
        </div>
        <ul id="menu">
            <li id="incidencias" onclick="Ic.enable(this)">Incidencias</li>
            <li id="puertos" onclick="Ic.enable(this)">Puertos</li>
            <li id="accesos" onclick="Ic.enable(this)">Accesos</li>
            <div class="clear"></div>
        </ul>
        <div id="content">
            <div id="splash_c" class="container">
                <div class="section_title">
                    Bienvenido a infocarretera
                </div>
                <p>¿Atrapado en un atasco? ¡Este es tu sitio! Pulsa en cualquiera de las opciones del menú superior para conseguir la información más actualizada sobre el tráfico de Euskadi.</p>
                <p>También puedes acceder a esta información a través de twitter agregando a <a href="http://twitter.com/infocarretera">infocarretera</a> o en Gtalk (infocarretera@gmail.com). Ambos son bots que responderán a tus dudas sobre el tráfico.</p>
            </div>
            
            <div id="loading_c" class="container" style="display:none;">
                <img src="{{ MEDIA_URL }}/m/img/loader.gif"/>
            </div>
            
            <div id="accesos_c" class="container" style="display:none;">
                <hr/>
                <ul>
                    <li onclick="Ic.show_entry(1);">Vitoria-Gasteiz <span class="arrow">&raquo;</span></li>
                    <li onclick="Ic.show_entry(2);">Bilbao <span class="arrow">&raquo;</span></li>
                    <li onclick="Ic.show_entry(3);">San Sebastian <span class="arrow">&raquo;</span></li>
                </ul>
            </div>
            <div id="accesos_listado_c" class="container" style="display:none;">
                <hr/><ul id="accesos_listado_c_ul"> </ul>
            </div>
            
            <div id="accesos_detalle" class="container" style="display:none;">
                <div class="accesos_head_info"><span id="accesos_detalle_estado"></span><span id="accesos_detalle_name"></span><div class="clear"></div></div>
                <hr/>
                <div id="accesos_detalle_cameras"></div>
            </div>
            
            <div id="incidencias_c" class="container" style="display:none;">
                <div id="incidencias_near_me" onclick="Ic.incident_near_me();">Cerca de mi</div>
                <span class="tip_top">Si la carretera que buscas no está en la lista, es que no hay no hay ningún problema de circulación.</span>
                <select id="incidencias_c_roads" onchange="Ic.enable_road_incidents()" size="1"></select>
            </div>
            
            <div id="incidencias_carretera_listado_c" class="container" style="display:none;">
                <hr/>
                <ul id="incidencias_carretera_listado_ul"></ul>
            </div>
            
            <div id="incidencias_near_listado_c" class="container" style="display:none;">
                <span class="section_title">Cerca de tu posición</span>
                <hr/>
                <ul id="incidencias_near_listado_c_ul"></ul>
                <span class="section_title">En la vía por la que circulas</span>
                <hr/>
                <ul id="incidencias_carretera_listado_c_ul"></ul>
            </div>
            
            <div id="incidencia_detalle" class="container" style="display:none;">
                <div id="incidencia_detalle_carretera" class="section_title"></div>
                <span id="incidencia_detalle_causa"></span>
                <div id="incidencia_extrainfo">
                    <span id="incidencia_detalle_km"></span> <span id="incidencia_detalle_distance"></span><br/>
                    <span id="incidencia_detalle_sentido"></span>
                </div>
                <div id="incidencia_detalle_afeccion"></div>
                <div class="clear"></div>
                <hr/>
                <div id="incidencia_detalle_map"></div>
                <div id="incidencia_buscar_camaras"></div>
            </div>
            
            <div id="puertos_c" class="container" style="display:none;">
                <span class="tip_top">Si el puerto que buscas no está en la lista, es que no hay no hay ningún problema de circulación.</span>
                <span class="section_title">Red primaria</span>
                <hr/>
                <ul id="puertos_c_ul_primera"></ul>
                <span class="section_title">Red secundaria y otros</span>
                <hr/>
                <ul id="puertos_c_ul_otros"></ul>
                <span class="tip">De izquierda a derecha estado del puerto para: <br/> Turismos, Camiones y Articulados</span>
            </div>
            
            <div id="puerto_detalle" class="container" style="display:none;">
                <div id="puerto_detalle_label" class="section_title"></div>
                <div id="p_extra_info">
                    <div id="puerto_detalle_provincia"></div>
                    <div id="puerto_detalle_carretera"></div>
                </div>
                <div id="p_est_info">
                    <span id="puerto_detalle_camiones"></span>
                    <span id="puerto_detalle_articulados"></span>
                    <span id="puerto_detalle_turismos"></span>
                </div>
                <div class="clear"></div>
                <hr/>
                <div id="puerto_detalle_map"></div>
                <span class="tip">De izquierda a derecha estado del puerto para: <br/> Turismos, Camiones y Articulados</span>
                <div id="puerto_buscar_camaras"></div>
            </div>
            
            <div id="camaras_cercanas_container" class="container" style="display:none;">
                <span class="section_title">Camaras cernacas a este punto</span>
                <div id="camaras_cercanas">
                    
                </div>
            </div>
        </div>
        <div id="footer">
            <div id="user_location">
                buscando...
            </div>
        </div>
        {% comment %}
            {% dajaxice_js_import %}
        {% endcomment %}
        
        <script type="text/javascript" src="{{ MEDIA_URL }}/m/main.compiled.js"></script>
        <script type="text/javascript">
            (function() {
                function _init() {
                    Ic.initialize();
                }
                if (window.blackberry) {
                    window.onload = _init;
                } else {
                    $(document).ready(_init);
                }
            })();
        </script>
        <script type="text/javascript">
        var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
        document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
        </script>
        <script type="text/javascript">
        try {
            var pageTracker = _gat._getTracker("UA-6439678-8");
            pageTracker._setDomainName(".infocarretera.com");
            pageTracker._trackPageview();
        } catch(err) {}</script>
    </body>
</html>